<template>
    <!-- 个人风险金补缴 -->
    <base-breadcrumb>
        <searchData :searchData="searchArr" @search="search"></searchData>
        <a-card>
            <div>
                <a-button
                    class="mb12"
                    v-btnPermission="'bm_018_add_01'"
                    type="primary"
                    icon="plus"
                    @click="handleManage(2)"
                    >新增</a-button
                >
                <a-alert type="info" show-icon>
                    <template slot="message">
                        <span>
                            个人初始预留风险金(元):
                            <a>{{ statistics.personalInitialReservation }}</a>
                        </span>
                        <a-divider type="vertical" />
                        <span>
                            已补缴(元):
                            <a>{{ statistics.hasPayment }}</a>
                        </span>
                        <a-divider type="vertical" />
                        <span>
                            剩余预留风险金(元):
                            <a>{{ statistics.totalResidueAmount }}</a>
                        </span>
                    </template>
                </a-alert>
            </div>
            <list-table
                ref="table"
                size="default"
                :page-keys="['pageNum', 'pageSize', 'total']"
                rowKey="key"
                :columns="columns"
                :request="loadData"
                :alert="true"
                show-size-changer
                show-quick-jumper
                showPagination="auto"
            >
                <span slot="description" slot-scope="text">
                    <ellipsis :length="8" tooltip>{{ text }}</ellipsis>
                </span>
                <span slot="operation" slot-scope="text, record">
                    <MoreButton>
                    <a v-btnPermission="'bm_018_loo_04'" @click="handleManage(0, record)">查看</a>
                    <!-- 编辑 -->
                    <span
                        v-btnPermission="'bm_018_edi_02'"
                        v-if="
                            record.auditStatus != 'SUBMITTED' &&
                            record.auditStatus != 'PAST' &&
                            record.auditStatus != 'ABOLISH' &&
                            record.auditStatus != 'UPLOAD'
                        "
                    >
                        <a @click="handleManage(1, record)">编辑</a>
                    </span>
                    <!-- 撤销 -->
                    <span v-if="record.auditStatus == 'SUBMITTED' && userId === record.creatorId&&hideBuquBtn()">
                        <a @click="handleUndo({ id: record.id, type: 3 })">撤销</a>
                    </span>
                    <!-- 作废 -->
                    <span v-if="record.auditStatus == 'PAST'" v-btnPermission="'bm_018_tov_05'">
                        <a @click="handleInvalid({ id: record.id, type: 2 })">作废</a>
                    </span>
                    <!-- 删除 -->
                    <span
                        v-if="record.auditStatus == 'DRAFT' || record.auditStatus == 'REJECTED'"
                        v-btnPermission="'bm_018_del_03'"
                    >
                        <a @click="handleRemoveParams({ id: record.id })">删除</a>
                    </span>

                    <span
                        v-btnPermission="'bm_018_loo_04'"
                        v-if="
                            record.auditStatus === 'PAST' ||
                            record.auditStatus === 'SUBMITTED' ||
                            record.auditStatus === 'REJECTED' ||
                            record.auditStatus === 'ABOLISH' ||
                            record.auditStatus === 'UPLOAD'
                        "
                    >
                        <approval-button
                            :status="record.auditStatus == 'UPLOAD' ? 'PAST' : record.auditStatus"
                            :id="record.id"
                        ></approval-button>
                    </span>
                        </MoreButton>
                </span>
                <span slot="auditStatus" slot-scope="text, record">
                    <list-status
                        :status="record.auditStatus"
                        :isApproval="true"
                        conversion="en"
                        :text="text"
                    ></list-status>
                </span>
            </list-table>
        </a-card>
    </base-breadcrumb>
</template>

<script>
import BasePage from '@/views/basePage' // 基础配置
import {
    getPageCommercialPerSupplementaryPayment,
    deleteByPrimaryKey,
    cancelProcess,
    revoke,
    getHasPayment
} from '@/api/businessAffairs/riskRefund'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import { paymentList, status } from './model.js'
const columns = [
    {
        title: '所属分公司',
        dataIndex: 'branchComName'
    },
    {
        title: '所属项目',
        dataIndex: 'projectName'
    },
    {
        title: '本次补缴(元)',
        dataIndex: 'paymentAmount'
    },
    {
        title: '补缴原因(元)',
        dataIndex: 'paymentReasonName'
    },
    {
        title: '剩余预留风险金(元)',
        dataIndex: 'residueAmount'
    },

    {
        title: '申请人',
        dataIndex: 'proposerName'
    },
    {
        title: '申请人岗位',
        dataIndex: 'proposerPostName'
    },

    {
        title: '填报时间',
        dataIndex: 'createTime'
    },
    {
        title: '状态',
        dataIndex: 'auditStatus',
        scopedSlots: { customRender: 'auditStatus' }
    },
    {
        title: '操作',
        dataIndex: 'operation',
        width: '230px',
        scopedSlots: { customRender: 'operation' }
    }
]
const searchArr = [
{
    name: '所属单位',
    valueKey: 'searchQuery',
    type: OrgTreeSelect,
  },
    // {
    //     name: '所属分公司',
    //     valueKey: 'branchComId',
    //     type: SelectSubCompany
    // },
    // {
    //     name: '所属项目',
    //     keyValue: 'branchComId',
    //     valueKey: 'projectId',
    //     type: SelectProject
    // },
    {
        name: '申请人',
        value: 'proposerName',
        type: 'input'
    },
    {
        name: '填报时间',
        type: 'dateRange',
        value: 'activityDate',
        attr: {
            rangeFormat: ['startTime', 'endTime']
        }
    },
    {
        name: '状态',
        value: 'auditStatus',
        type: 'select',
          data: [
            {
                value: '0',
                label: '待提交审批'
            },
            {
                value: '1',
                label: '审批中'
            },
            {
                value: '2',
                label: '资料上传中'
            },
            {
                value: '3',
                label: '审批通过'
            },
            {
                value: '5',
                label: '审批不通过'
            },
            {
                value: '4',
                label: '已作废'
            }
        ]
    },
    {
        name: '补缴原因',
        value: 'paymentReason',
        type: 'select',
        data: paymentList
    }
]
import { typeListApproval } from '@/utils/util'
import { STable } from '@/components'
export default {
    name: 'a' + Date.now(),
    extends: new BasePage(),
    components: {
        STable
    },
    data() {
        this.columns = columns
        this.searchArr = searchArr
        return {
            queryParam: {},
            userId: JSON.parse(sessionStorage.getItem('ycloud-user_info')).id,
            removeApi: {
                remove: deleteByPrimaryKey,
                invalid: revoke,
                undo: cancelProcess
            }, // api
            statistics: { hasPayment: 0, personalInitialReservation: 0, totalResidueAmount: 0 },
            loadData: async (parameter) => {
                const requestParameters = Object.assign({}, parameter, { param: this.queryParam })
                const params = Object.assign({}, parameter, this.queryParam)
                this.getHasPaymentReq(params)
                return getPageCommercialPerSupplementaryPayment(requestParameters).then((res) => {
                    console.log(res)
                    if (res.code === '0') {
                        res.data.list.forEach((i) => {
                            i.auditStatus = status[i.auditStatus]
                        })
                        return { code: 200, data: res.data.list, total: res.data?.total }
                    }
                })
            }
        }
    },
    methods: {
        //搜索
        search(value) {
            value && (this.queryParam = value)
            this.$refs.table.refresh(true)
        },
        getHasPaymentReq(requestParameters) {
            getHasPayment(requestParameters).then((res) => {
                this.statistics = res.data
            })
        },
        // 操作栏
        handleManage(type, record) {
            let query = {
                editModel: type,
                commissionType: 0
            }
            if (record && record.id) {
                query.id = record.id
            }
            this.$router.push({
                name: 'UpdatePersonalRiskPayment',
                query
            })
        }
    }
}
</script>


